<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../common/taglibs.jsp" %>

<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<%@ include file="../common/btcss.jsp" %>
	
	<link rel="stylesheet" href="${ctx }/static/lib/weekdatepicker/css/default.css">
	<link rel="stylesheet" href="${ctx }/static/lib/datatables/1.10.9/css/jquery.dataTables.min.css">
	<link rel="stylesheet" href="${ctx }/static/lib/uploadify/3.1/css/uploadify.css">
	
	<title>资源白名单配置管理系统</title>
	
	<style>
		.icon-cancel{
			background:url('${ctx}/static/images/cancel.png') no-repeat center center;
		}
	</style>
</head>
<body>
	<ol class="breadcrumb navbar-fixed-top">
        <li><a href="${ctx }/config/welcome">首页</a></li>
        <li><a href="${ctx }/ipcclist">IPCC设置管理</a></li>
        <li><a href="javascript:void(0);" style="text-decoration: none;font-color:gray;">航线投放时间段管理</a></li>
    </ol>
    
	<div class="container" style="margin-top: 40px; margin-bottom: 10px;">
		<form id="ipcclistform" action="#">
			<table>
				<tr>
					<td style="padding: 2px 10px 2px 10px;">渠道： 
						<%=session.getAttribute("cid") %>
					</td>
					<td style="padding: 2px 10px 2px 10px;">资源：
						<%=session.getAttribute("ds") %>
					</td>
					<td style="padding: 2px 10px 2px 10px;">IPCC：
						<%=session.getAttribute("ipcc") %>
					</td>
					<td style="padding: 2px 10px 2px 10px;"><button
							class="btn btn-default" id="addroute" type="button">添加航线</button>
					</td>
					<td style="padding: 2px 10px 2px 10px;"><button
							class="btn btn-default" id="improute" type="button">批量导入航线</button>
					</td>
				</tr>
			</table>
			<table>
				<tr>
					<td style="padding: 2px 10px 2px 10px;">出发地国家： 
						<input type="text" id="departurecountry" name="departurecountry" />
					</td>
					<td style="padding: 2px 10px 2px 10px;">目的地国家：
						<input type="text" id="arrivalcountry" name="arrivalcountry" />
					</td>
					<td style="padding: 2px 10px 2px 10px;">
					<button class="btn btn-default" id="search" type="button">查询</button>
					<button class="btn btn-default" id="beathedit" type="button">批量修改</button>
					<button class="btn btn-default" id="beathdel" type="button">批量删除</button>
					<button class="btn btn-default" id="editall" type="button">全部修改</button>
					</td>
				</tr>
			</table>
		</form>
	</div>
	<div class="container">
		<table class="table table-striped table-bordered example">
			<thead>
				<tr>
					<th>编号</th>
					<th>出发地国家</th>
					<th>出发地</th>
					<th>目的地国家</th>
					<th>目的地</th>
					<th>航程类型</th>
					<th>开启/关闭</th>
					<th>开关</th>
					<th>操作</th>
				</tr>
			</thead>
		</table>
	</div>

	<div class="container">
		<div class="row">
			<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
				aria-labelledby="exampleModalLabel" >
				<div class="modal-dialog" role="document" style="width:720px;">
					<div class="modal-content">
						<div class="modal-header">
							<h4 class="modal-title" id="exampleModalLabel" style="font-weight:bolder;">批量导入航线数据</h4>
						</div>
						<div class="modal-body">
							<form>
								<div id="queueID"></div>
								<input id="file_upload" name="file_upload" type="file"
									multiple="true">
							</form>

							<form id="importform">
								<input id="impmid" name="impmid" type="hidden"
									value="<c:out value="${mid}"></c:out>" />
								<div id="result"></div>
								<input type="hidden" id="time" name="time"  value=""/>
							</form>
							
							<div id="datepicker"></div><br />
							<div style="text-align: center; margin-top:10px;">
								<label class="control-label" id="impsuccess"></label>
							</div>
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-default" id="cancel">关闭</button>
							<button type="button" class="btn btn-primary" id="import">导入</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="outter" style="display: none;">
		<div id="showData"></div>
	</div>

	<%@ include file="../common/btjs.jsp" %>
	
	<script src="${ctx }/static/lib/weekdatepicker/js/weekDataPicker.js"></script>
	<script src="${ctx }/static/lib/datatables/1.10.9/js/jquery.dataTables.js"></script>
	<script src="${ctx }/static/lib/datatables/1.10.9/js/dataTables.bootstrap.js"></script>
	<script src="${ctx }/static/lib/uploadify/3.1/js/jquery.uploadify.min.js"></script>
	
	<script src="${ctx }/static/js/routeconfig.js"></script>
	<script src="${ctx }/static/js/showimg.js"></script>
	<script src="${ctx }/static/js/config_cid__rs_ipcc.js"></script>
	<script src="${ctx }/static/js/initConfig.js"></script>
	
	<script>
		var global;
		$(function(){
			global = $("#datepicker").weekDataPicker({
                chooseColor: 'greenyellow',
                chooseRgb: 'rgb(173, 255, 47)',
                unChooseColor: '#eee',
                mode: 'edit'
            });
            
			$('#addroute').click(function(){
				$('#message').html("");
				window.location.href = 'addroute';
			});
			
			initConfig('cid', 'ds', 'ipcc', cid_array);
			
			$('#beathedit').click(function(){
				var idlst = "";
				var i = 0;
				$("input[name='batch']").each(function(){
				    if ($(this).is(':checked')) {
				    	if(i > 0){
				    		idlst = idlst + ",";
				    	}
				    	idlst = idlst + $(this).attr('value');
				    	i = i + 1;
				    }
				});
				if(i < 1){
					alert("请选择需要修改的数据！");
					return false;
				}
				window.location.href = 'beathupdatetroute?idList='+ idlst;
			});
			
			$('#beathdel').click(function(){
				var idlst = "";
				var i = 0;
				$("input[name='batch']").each(function(){
				    if ($(this).is(':checked')) {
				    	if(i > 0){
				    		idlst = idlst + ",";
				    	}
				    	idlst = idlst + $(this).attr('value');
				    	i = i + 1;
				    }
				});
				if(i < 1){
					alert("请选择需要删除的数据！");
					return false;
				}
				if (confirm("此" + i + "条航线信息将会被批量删除，是否继续？")) {
					window.location.href = 'beathdeltroute.ajax?idList='+ idlst;
		        }
			});

			$('#improute').click(function() {
				$('#result').html('');
				$('#impsuccess').html('');
				$('#exampleModal').modal({
					backdrop : false,
					keyboard : false,
					show : true
				});
			});

			$('#file_upload').uploadify({
				'swf' : '${ctx}/static/lib/uploadify/3.1/js/uploadify.swf',
				'uploader' : '${ctx}/excel/upload',
				'queueID ' : 'queueID',
				'cancelImg' : '${ctx}/static/lib/uploadify/3.1/img/uploadify-cancel.png',
				'auto' : true,
				'multi' : false,
				'removeTimeout' : 1,
				'fileTypeDesc' : '.xls|.xlsx',
				'fileTypeExts' : '*.xls;*.xlsx',
				'buttonText' : '请选择航线数据文件',
				'onUploadError' : errorCallback,
				'onUploadSuccess' : function(file, data,
						response) {
					$('#result').html('');
					$('#impsuccess').html('');
					$('#' + file.id).find('.data')
							.html('上传完毕!');
					if (response == true) {
						showInfo(file, data);
					}
				}
			});

			$('#import').click(function() {
				var map = global.getData();
	            var s = JSON.stringify(map);
	            $('#time').val(s);
	            
				if ($('input[name^="attach_"]').length > 0) {
					$('#impsuccess').html("正在导入并设置航线开启状态，请稍后...");
					$.ajax({
						cache : false,
						type : "POST",
						url : "excel/import",
						data : $('#importform').serialize(),// 你的formid
						async : false,
						error : function(request) {
							alert("Connection error");
						},
						success : function(data) {
							var json = JSON.parse(data);
							if (json.status == "1") {
								$('#impsuccess').html(
										"导入航线数据成功!");
							} else {
								$('#impsuccess').html(
										json.message);
							}
						}
					});
				} else {
					$('#result').html('');
					$('#impsuccess').html("请先选择excel文件上传,然后再进行导入操作!");
				}
			});
			
			// 全部修改
			$('#editall').click(function(){
				if (confirm("此操作会修改所有航线数据，是否继续？")) {
					window.location.href = 'allupdatetroute';
				}
			});

			$('#cancel').click(function() {
				$('#result').html('');
				$('#impsuccess').html('');
				$('#exampleModal').modal('hide');
				oTable.ajax.reload();
			});
		});

		//显示提示信息，textstyle2为绿色，即正确信息；textstyl1为红色，即错误信息
		function showInfo(file, data) {
			var res = JSON.parse(data);

			var msg = '<div id="div_' + file.id + '" style="height:30px;">'
					+ "<input type=\"hidden\" name=\"attach_" + file.id  + "\" id=\"attach_" + file.id + "\" value='" + res.NEW + "' /> "
					+ '<span style="font-size:16px; height:26px;">'
					+ '<a target="_blank" href="javascript:void(0);" style="text-decoration:underline;color:black;">'
					+ res.OLD
					+ '</a>&nbsp;&nbsp;'
					+ '<a href="javascript:void(0);" onclick="delAttach(this)" id="del_'
					+ file.id
					+ '" class="icon-cancel" style="width:30px;">&nbsp;&nbsp;&nbsp;&nbsp;</a>'
					+ '</span>' + '</div>';
			$("#result").append(msg);
		}

		function errorCallback(event, queueId, fileObj, errorObj) {

		}

		// 删除确认
		function delConfirm(id){
			if (confirm("该条数据将要删除，是否继续？")) {
				window.location.href = 'deleteroute.ajax?id=' + id;
	        }
		}
		
		// 编辑
		function goEdit(id){
			window.location.href = 'editroute?id=' + id;
		}
		
		// 开关
		function goSwitch(id,status){
			window.location.href = 'updateroute.ajax?id=' + id + '&status=' + status;
		}
		
		function delAttach(obj) {
			$('#' + $(obj).attr("id").replace("del", "div")).remove();
		}
	</script>
</body>
</html>